// 配置路由
// 引入vue-router插件：经过打印来查看，引入进来的VueRouter构造函数
// vue基础学习构造函数：Vue,VueComponent,Vuex.Store,VueRouter
import VueRouter  from "vue-router";
import Vue from "vue";

// 安装插件
Vue.use(VueRouter)


// 引入路由组件
import Home from '@/pages/Home'
import About from '@/pages/About'


// 引入二级路由
import Message from '@/pages/homes/Message'
import News from '@/pages/homes/News'


// 引入三级路由
import Detial from '@/pages/homes/messages/Detial'



// 配置项目的路由
// 通过VueRouter【路由器】类，创建了一个VueRouter类的一个实例
// 直接对外暴露 
export default new VueRouter({
    mode:'hash',
    // 配置项的k不能变
    routes:[
        {
            // path设置路由的K,path有的属性值务必都是小写的(设置path右侧V的时候，别忘记反斜杠)
            path:'/home',
            component:Home,


            //配置项:里面出现children,children里面放置的一定是子路由
            // 二级
            children:[
                {
                    path:'message',
                    component:Message,

                    // 三级
                    children:[
                        {
                            name:'hhhh',
                            // query
                            // path:'detial',

                            // params
                            path:'detial/:id/:name',
                            component:Detial
                        }
                    ]
                },
                {
                    path:'news',
                    component:News
                }
            ]
        },
        {
            path:'/about',
            component:About
        },
        //重定向书写位置,可以放在任意地方（不能放在路由里面），一般都是书写在最后位置
        {
            path:'/',
            //重定向：重定向到about这个K
            redirect:'/about'
        }
    ]
})

